<template>
  <div>
    <!--咨询中心-->
    <a-row :gutter="24">
      <!--目录树结构-->
      <a-card style="width: 100%;margin:12px 12px;min-height:700px">
        <a-col :span="4">
          <template>
            <a-directory-tree defaultExpandAll :defaultSelectedKeys="defaultSelectedKeys" @select="onSelect" @expand="onExpand">
              <a-tree-node title="目录" key="A0">
                <a-tree-node :title="item.menuName" :key="item.id" isLeaf v-for="item in tablist" />
              </a-tree-node>
            </a-directory-tree>
          </template>
        </a-col>
        <!--目录内容-->
        <a-col :span="16">
          <eoa-cms-menu-article-modal ref="eoaCmsMenuArticleModal"></eoa-cms-menu-article-modal>
        </a-col>
      </a-card>

    </a-row>
  </div>

</template>

<script>

  import ACol from "ant-design-vue/es/grid/Col"
  import { getFileAccessHttpUrl } from '@/api/manage'
  import { getSiteInfo} from '@/api/api'
  import EoaCmsMenuArticleModal from './modules/EoaCmsMenuArticleModal'
  import { getAction } from '@/api/manage'

  export default {
    name: "EoaCmsArticlePortal",
    components: {
      ACol,
      EoaCmsMenuArticleModal
    },
    watch:{
      defaultSelectedKeys:{
        immediate:true,
        deep:true,
        handler(val){
          console.log(val);
          if(!val||val.length==0){
            // console.log(val,"--------------9111-----");
             this.findMenuAll()
          }else{
            console.log(val[0]);
            this.$refs.eoaCmsMenuArticleModal.loadDate(val[0]);
          }
        }
      }
    },
    data() {
      return {
        defaultSelectedKeys:[],
        url: {
          menuList: "/api/erp/workbench/article/eoaCmsMenu/findAlllist",
          articleList: "/api/erp/workbench/article/eoaCmsArticle/list",
        },
        tablist: []
      }
    },
    created() {
      console.log(this.$route.query)
      if(this.$route.query.id){
        this.defaultSelectedKeys=[];
        this.defaultSelectedKeys.push(this.$route.query.id);
      }
    },
    mounted () {
      //this.findMenuAll()
    },
    methods: {
      findMenuAll() {
        let that = this
        getAction(this.url.menuList).then((res) => {
          console.log(res,'==========92===========');
          if(res.success){
            that.tablist = res.result
           //that.$refs.eoaCmsMenuArticleModal.loadDate(that.tablist[0].id)
          }
        })
      },
      onSelect(keys) {
        console.log(keys,'==========95===========')
        this.$refs.eoaCmsMenuArticleModal.resetParams();
        this.$refs.eoaCmsMenuArticleModal.loadDate(keys[0]);
        // BUG#3198分页错误
        this.$refs.eoaCmsMenuArticleModal.params.columnId = keys[0];
      },
      onExpand() {
        console.log('Trigger Expand');
      },
      handleInfiniteOnLoad() {
        this.$message.warning('已加载全部');
      },
    }
  }
</script>

<style lang="less" scoped>
  .ant-list-item-meta-title {
   font-weight: 600;
  }
  .demo-infinite-container {
    border: 1px solid #e8e8e8;
    overflow: auto;
    padding: 8px 24px;
    overflow: auto;
    height: 100px;
  }
  .demo-loading-container {
    position: absolute;
    bottom: 40px;
    width: 100%;
    text-align: center;
  }
</style>